<template>
  <page-wrap
    ref="pageWrap"
    hideTab
    back
    :title="title"
    :showTop="false"
    :dark="loaded ? false : true"
    :hideSafeArea="true"
  >
    <view class="wrapper" :style="'padding-top:' + navHeight + 'px;'">
      <view class="content">
        <view class="successIcon">
          <img :src="zhituPaySuccessIcon" alt="" class="zhituPaySuccessIcon" />
        </view>
        <view class="successText"> 支付成功 </view>
        <!-- <view class="subTipsOne">开启消息提醒</view>
        <view class="subTipsTwo">能更快提醒你服务状态~</view>
        <view class="directionBtn" @click="handlePaySubscribe"
          >开启消息提醒</view
        >
        <view class="returnBtn" @click="handleToUseRight"
          >去{{ zhituNameMapper[rightId] || "使用服务" }}</view
        > -->
        <view class="returnBtn" @click="returnToZhituIndex"
          >去使用职途求职神器</view
        >
      </view>
    </view>
  </page-wrap>
</template>

<script>
import { env } from '@/api/root';
import { getPersonRightNum } from '@/api/modules/career';
export default {
  data() {
    return {
      title: '',
      personId: uni.getStorageSync('person-id').slice(2) || undefined,
      personName: uni.getStorageSync('personName') || undefined,
      navHeight: getApp().globalData.navHeight,
      rightId: null,
      cardType: null,
      //支付成功后跳转的路由
      directionMapper: {
        1: `/pagesSub/userCenter/careerPathV2/index`, //disc测评 特殊处理
        2: `/pagesSub/career/activity/vocationalAssessment`, //职业测评
        4: `/pagesSub/career/activity/ResumeDiagnosis?fromWhere=careerPath`, //简历诊断
        7: `/pagesSub/userCenter/careerPathV2/index`, //职途报告
        9: `/pagesSub/careerNew/selectCareerReport/index?rightCount=${3}`, //职业报告
        17: `/pagesSub/companyCenter/interviewAI/majorSearchAI?userNum=0&rightCount=3` //AI面试
      },
      zhituNameMapper: {
        1: '性格测评', //disc测评
        2: '职业测评', //职业测评
        4: '简历诊断', //简历诊断
        7: '职途报告', //职途报告
        9: '职业报告', //职业报告
        17: 'AI面试' //AI面试
      },
      zhituPaySuccessIcon:
        this.$imgBaseSelf + 'careerPath/zhituPaySuccessIcon_new.png'
    };
  },
  onShow() {},
  onLoad(opt) {
    console.log(opt);
    this.rightId = opt.rightId;
    this.cardType = opt.cardType;
  },
  mounted() {},
  methods: {
    async getPersonRightNumFn(rightId) {
      const params = {
        personId: this.personId || undefined,
        rightId,
        cardType: this.cardType
      };
      const res = await getPersonRightNum(params);
      return res.data.ownNum - res.data.useNum;
    },
    async handleToUseRight() {
      if (this.rightId) {
        let url = this.directionMapper[this.rightId];
        //进行一些特殊处理
        if (this.rightId == 1) {
          const discLeftUseNum = await this.getPersonRightNumFn(1); // 性格测评的内层rightId是1
          let url;
          if (env == 'test') {
            url = `https://3gtest.crm1001.com/disc/#/disc/question?personId=${this.personId}&iname=${this.personName}&phone=18825449087&from=miniprogramV2&discLeftUseNum=${discLeftUseNum}&cardType=${this.cardType}`;
          } else if (env == 'pro' || env == 'pre') {
            url = `https://3g.crm1001.com/v2/disc/#/disc/question?personId=${this.personId}&iname=${this.personName}&phone=18825449087&from=miniprogramV2&discLeftUseNum=${discLeftUseNum}&cardType=${this.cardType}`;
          }
          uni.redirectTo({
            url:
              '/pagesSub/public/web/descWebView?link=' + encodeURIComponent(url)
          });
          return;
        }
        uni.redirectTo({
          url
        });
      } else {
        uni.redirectTo({
          url: `/pagesSub/userCenter/careerPathV2/index`
        });
      }
    },
    returnToZhituIndex() {
      uni.redirectTo({
        url: `/pagesSub/userCenter/careerPathV2/index`
      });
    }
  }
};
</script>

<style lang="scss" scoped>
$img-base-person: $img-base + 'careerPath/';
@include img-base-self('.person-top', 'careerPath/upPart.png?v=1');

.wrapper {
  .content {
    display: flex;
    flex-direction: column;
    margin-top: 202rpx;
    align-items: center;

    .successIcon {
      .zhituPaySuccessIcon {
        width: 240rpx;
        height: 240rpx;
      }
    }

    .successText {
      font-size: 40rpx;
      font-family: PingFang-SC, PingFang-SC;
      font-weight: bold;
      color: #222222;
      line-height: 40rpx;
      margin-top: 16rpx;
    }

    .subTipsOne {
      margin-top: 60rpx;
      font-size: 28rpx;
      font-family: PingFangSC, PingFang SC;
      font-weight: 400;
      color: #333333;
      line-height: 40rpx;
    }

    .subTipsTwo {
      margin-top: 10rpx;
      font-size: 28rpx;
      font-family: PingFangSC, PingFang SC;
      font-weight: 400;
      color: #333333;
      line-height: 40rpx;
    }

    .directionBtn {
      display: flex;
      align-items: center;
      justify-content: center;
      width: calc(100vw - 64rpx);
      margin: 0 32rpx;
      margin-top: 64rpx;
      background: #f75a3e;
      border-radius: 16rpx;
      font-size: 28rpx;
      font-family: PingFangSC, PingFang SC;
      font-weight: 500;
      color: #ffffff;
      line-height: 36rpx;
      padding: 22rpx;
    }

    .returnBtn {
      display: flex;
      align-items: center;
      justify-content: center;
      width: calc(100vw - 64rpx);
      margin: 0 32rpx;
      margin-top: 98rpx;
      border-radius: 16rpx;
      font-size: 28rpx;
      font-family: PingFangSC, PingFang SC;
      font-weight: 500;
      background: #f75a3e;
      border-radius: 40rpx;
      color: #ffffff;
      line-height: 36rpx;
      padding: 22rpx;
      border: 2rpx solid #f75a3e;
    }
  }
}
</style>
